<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button>按钮</button>
    <script>
        // this指向问题 一般情况下this 最终指向的是那个调用它的对象（你要知道调用的属性/方法是哪个对象里面的 this指向的就是那个对象）
        // 1.在全局作用域或者普通函数中的this指向全局对象window(注意定时器里的this指向window)
        console.log(this);//window
        function fn() {
            console.log(this);//window
        }
        window.fn()//
        setTimeout(function () {
            console.log(this);//setTimeout()属于window顶级对象的方法 所以定时器里的this会指向window对象
        }, 1000)
        // 2.方法调用中谁调用this就指向谁
        var o = {
            sayHi: function () {
                console.log(this);//指向调用者的对象 o
            }
        }
        o.sayHi()
        var btn = document.querySelector('button')
        btn.addEventListener('click', function () {
            console.log(this);//this指向button按钮对象 函数的调用者
            // this.disabled = true
        })
        //  3.构造函数中this指向构造函数的实例 （构造函数名首字母大写 区分普通函数/构造函数需要new一下调用）
        function Fun() {
            console.log(this);//this指向Fun这个实例对象
        }
        var fun = new Fun()
        // 总结 只有函数调用了才能确认this指向谁,this会指向调用者的对象或实例对象。
    </script>
</body>

</html>